import React, { Component } from 'react';
import { formatMessage } from 'umi-plugin-react/locale'; 
import { Card, Tabs, Upload, Button, Form, Modal, Input, Icon, message, Select } from 'antd';
import styles from './index.less';
import { postSensitiveAdd, postSensitiveUpdate } from '@/services/secureRejection';

class AddRejection extends Component {
    constructor(props) {
        super(props);
        this.state = {
            rejectionInfo: null,
            rejectionVisible: false,
        };
    }

    componentDidMount() {
        if (this.props.onRef) {
            this.props.onRef(this)
        }
    }

    _init_ = row => {
        this.setState({
            rejectionVisible: true,
            rejectionInfo: row,
        })
    }

    rejectionCancel = () => {
        this.setState({
            rejectionInfo: null,
            rejectionVisible: false,
        })
    }

    rejectionSubmit = e => {
		e.stopPropagation();
        e.preventDefault();
        const { rejectionInfo } = this.state;
        const { form } = this.props;
        let formInfo = form.getFieldsValue();
        // console.log(formInfo);
        form.validateFields(async (err, values) => {
            if (!err) {
                let obj = {
                    content: formInfo.content,
                    type: '1',
                };
                let res = { code: -1, data: false, message: formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.operationFailed' }) }; 
                if (rejectionInfo && rejectionInfo.id) {
                    obj.id = rejectionInfo.id;
                    res = await postSensitiveUpdate(obj);
                } else {
                    obj.categoryId = formInfo.rejectionCategory;
                    res = await postSensitiveAdd(obj);
                };
                console.log(res);
                if (res.code === 0) {
                    this.props.getList();
                    this.rejectionCancel();
                    message.success(formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.operationSuccess' })); 
                }
            }
        })
    }

    render() {
        const { rejectionVisible, rejectionInfo } = this.state;
        const { categoryList, categoryId } = this.props;
        const { getFieldDecorator } = this.props.form;
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 3 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 21 },
            },
        };

        return (
            <Modal
                title={formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.addOrEditBlockWord' })}
                onCancel={this.rejectionCancel}
                visible={rejectionVisible}
                footer={[
                    <Button onClick={this.rejectionCancel}>{formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.cancel' })}</Button>,
                    <Button type="primary" onClick={this.rejectionSubmit}>{formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.confirm' })}</Button>
                ]}
                width={'800px'}
                destroyOnClose
            >
                <Form>
                    {rejectionInfo && rejectionInfo.categoryId ? null : (
                        <Form.Item label={formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.instructionCategory' })} {...formItemLayout}>
                            {getFieldDecorator('rejectionCategory', {
                                initialValue: rejectionInfo?.categoryId ? rejectionInfo.categoryId : categoryId && categoryId !== '' ? categoryId : undefined,
                            })(
                                <Select placeholder={formatMessage({ id: 'largeModelCenter.secureRejection.answerRejection.add.selectOrModifyCategory' })}>
                                    {categoryList && categoryList.length > 0 && categoryList.map(item => {
                                        return (
                                            <Select.Option value={item.id} key={item.id}>{item.name}</Select.Option>
                                        );
                                    })}
                                </Select>
                            )}
                        </Form.Item>
                    )}
                    <Form.Item>
                        {getFieldDecorator('content', {
                            initialValue: rejectionInfo && rejectionInfo.content ? rejectionInfo.content : '',
                        })(<Input.TextArea rows={5} />)}
                    </Form.Item>
                </Form>
            </Modal >
        );
    }
}

export default Form.create()(AddRejection);
